<%@ page contentType="text/html; charset=utf-8"%>
<!DOCTYPE html>
<head>

    <!-- Basic Page Needs
  ================================================== -->
	<meta charset="utf-8">
	<title>兼职乐</title>
	<meta name="description" content="Free Responsive Html5 Css3 Templates | zerotheme.com">
	<meta name="author" content="www.zerotheme.com">
	
    <!-- Mobile Specific Metas
  ================================================== -->
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
    
    <!-- CSS
  ================================================== -->
  	<link rel="stylesheet" href="css/zerogrid.css">
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/component.css">
	<link rel="stylesheet" href="css/responsive.css">
	<link rel="stylesheet" href="css/table.css">
	<link rel="stylesheet" type="text/css" href="css/styles.css" media="all" />
    <link rel="stylesheet" type="text/css" href="css/demo.css" media="all" />
	
	<link href='./images/favicon.ico' rel='icon' type='image/x-icon'/>
	<script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/jquery.min1.js"></script>
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/change1.js"></script>
	<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=m0B4dSh0nCmIXEKwsUTCLQ7IywRRgaG7"></script>
	<script type="text/javascript">
	var items=null;
	var index0=0;
	function getMessage() {
		$.post("../GetServlet", {},  
				function(data,status){
				    items= eval('('+data+')');
				    jobGet(items);
		});
	}
	function jobGet(items){
		var date ="";
		var flag=true;
		var x=0;
		for(var j=0;j<items[0].posts.length;j++){
			for(var i=0;i<items[1].job.length&&flag;i++){
				var postid2=items[1].job[i].postid;
				if(postid2!=null&&postid2==items[0].posts[j].postid){
					if(items[1].job[i].paytype=="日结"){
						date=items[1].job[i].date;
						document.getElementById("date"+(x+1)).innerHTML="<b>工作时间：</b>"+date;
					}
					if(items[1].job[i].paytype=="月结"){
						date=items[1].job[i].date+" 上午 :"+items[1].job[i].time1+" 中午:"+items[1].job[i].time2+" 下午:"+items[1].job[i].time3;
						document.getElementById("date"+(x+1)).innerHTML="<b>工作时间：</b>"+items[1].job[i].date+"...";
					}
						document.getElementById("salary"+(x+1)).innerHTML="￥"+items[1].job[i].salary;
					 	document.getElementById("jobname"+(x+1)).innerHTML=items[1].job[i].jobname;
					 	document.getElementById("paytype"+(x+1)).innerHTML=items[1].job[i].paytype;
					 	document.getElementById("place"+(x+1)).innerHTML="<b>工作地点：</b>"+items[1].job[i].place;
					 	document.getElementById("index"+(x+1)).className=0;
					 	$("#date"+(x+1)+"").attr("title",date);
					 	$("#place"+(x+1)+"").attr("title",items[1].job[i].place);
					 	$("#notice"+(x+1)+"").attr("title",items[1].job[i].joboffer);
					 	document.getElementById("notice"+(x+1)).innerHTML="<b>工作提供单位：</b>"+items[1].job[i].joboffer;
					 	document.getElementById("state"+(x+1)).innerHTML="<b>需招人数：</b>"+items[1].job[i].jobstate+"名";
					 	document.getElementById("postdate"+(x+1)).innerHTML="<b>发布时间：</b>"+items[1].job[i].postdate;
					 	document.getElementById("job_notice"+(x+1)).innerHTML=items[1].job[i].notice;
					 	document.getElementById("jobid"+(x+1)).className=items[1].job[i].jobid;
					 	document.getElementById("back"+(x+1)).className=i;
					 	document.getElementById("next"+(x+1)).className=i;
					 	flag=false;
					 	x++;
				}
			}
			flag=true;
		}
	}
	function change_next(obj){
		//角标加一
		//字符串截取 获取数字标识
		var name=obj.id;
		var b=name.indexOf("t");
		var title=name.substring(b+1,b+2);
		//当前工作编号
		var index=parseInt(document.getElementById("index"+title).className)+1;
		var jobid=document.getElementById("jobid"+title).className;
		//当前工作对应的post编号
		var postid=-1;
		for(var i=0;i<items[1].job.length;i++){
			if(items[1].job[i].jobid==jobid){
				postid=items[1].job[i].postid;
			}
		}
		if(items[1].job[index].postid==postid){
			var date="";
			if(items[1].job[index].paytype=="日结"){
				date=items[1].job[index].date;
				document.getElementById("date"+title).innerHTML="<b>工作时间：</b>"+date;
			}
			else{
				date=items[1].job[index].date+" 上午 :"+items[1].job[index].time1+" 中午"+items[1].job[index].time2+" 下午"+items[1].job[index].time3;
				document.getElementById("date"+title).innerHTML="<b>工作时间：</b>"+items[1].job[index].date+" ....";
			}
			document.getElementById("salary"+title).innerHTML="￥"+items[1].job[index].salary;
		 	document.getElementById("jobname"+title).innerHTML=items[1].job[index].jobname;
		 	document.getElementById("paytype"+title).innerHTML=items[1].job[index].paytype;
		 	$("#date"+title+"").attr("title",date);
		 	$("#place"+title+"").attr("title",items[1].job[index].place);
		 	$("#notice"+title+"").attr("title",items[1].job[index].joboffer);
		 	document.getElementById("notice"+title).innerHTML="<b>工作提供单位：</b>"+items[1].job[index].joboffer;
		 	document.getElementById("job_notice"+title).innerHTML=items[1].job[index].notice;
		 	document.getElementById("postdate"+title).innerHTML="<b>发布时间：</b>"+items[1].job[index].postdate;
		 	document.getElementById("place"+title).innerHTML="<b>工作地点：</b>"+items[1].job[index].place;
		 	document.getElementById("state"+title).innerHTML="<b>需招人数：</b>"+items[1].job[index].jobstate+"名";
		 	//重新定位角标
		 	document.getElementById("index"+title).className=index;
		 	document.getElementById("jobid"+title).className=items[1].job[index].jobid;
		 	document.getElementById("allmap"+title).style.display="block";
		 	var map = new BMap.Map("allmap"+title);         
		 	var x=document.getElementById("job_notice"+title);
			x.style.display="none";
			var y=document.getElementById("image0"+title);
			y.style.display="none";
			map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
			var local = new BMap.LocalSearch(map, {
				renderOptions:{map: map}
			});
			local.search(items[1].job[index].place);
		}

	}
	function change_back(obj){
		//字符串截取 获取标签数字标识。
		var name=obj.id;
		var b=name.indexOf("k");
		var title=name.substring(b+1,b+2);
		//角标加一
		var index=parseInt(document.getElementById("index"+title).className)-1;
		//当前工作编号
		var jobid=document.getElementById("jobid"+title).className;
		//获取当前工作对应的post编号
		var postid=-1;
		for(var i=0;i<items[1].job.length;i++){
			if(items[1].job[i].jobid==jobid){
				postid=items[1].job[i].postid;
			}
		}
		//判断，上一个工作也属于postid编号
		if(items[1].job[index].postid==postid){
			var date="";
			if(items[1].job[index].paytype=="日结"){
				date=items[1].job[index].date;
				document.getElementById("date"+title).innerHTML="<b>工作时间：</b>"+date;
			}
			else{
				date=items[1].job[index].date+" 上午 :"+items[1].job[index].time1+" 中午"+items[1].job[index].time2+" 下午"+items[1].job[index].time3;
				document.getElementById("date"+title).innerHTML="<b>工作时间：</b>"+items[1].job[index].date+" ....";
			}
			document.getElementById("salary"+title).innerHTML="￥"+items[1].job[index].salary;
		 	document.getElementById("jobname"+title).innerHTML=items[1].job[index].jobname;
		 	document.getElementById("paytype"+title).innerHTML=items[1].job[index].paytype;
		 	$("#date"+title+"").attr("title",date);
		 	$("#place"+title+"").attr("title",items[1].job[index].place);
		 	$("#notice"+title+"").attr("title",items[1].job[index].joboffer);
		 	document.getElementById("notice"+title).innerHTML="<b>工作提供单位：</b>"+items[1].job[index].joboffer;
		 	document.getElementById("job_notice"+title).innerHTML=items[1].job[index].notice;
		 	document.getElementById("postdate"+title).innerHTML="<b>发布时间：</b>"+items[1].job[index].postdate;
		 	document.getElementById("place"+title).innerHTML="<b>工作地点：</b>"+items[1].job[index].place;
		 	document.getElementById("state"+title).innerHTML="<b>需招人数：</b>"+items[1].job[index].jobstate+"名";
		 	//重新定位角标
		 	document.getElementById("index"+title).className=index;
		 	document.getElementById("job_notice"+title).innerHTML=items[1].job[index].notice;
		 	document.getElementById("jobid"+title).className=items[1].job[index].jobid;
		 	document.getElementById("allmap"+title).style.display="block";
		 	var map = new BMap.Map("allmap"+title);         
		 	var x=document.getElementById("job_notice"+title);
			x.style.display="none";
			var y=document.getElementById("image0"+title);
			y.style.display="none";
			map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);
			var local = new BMap.LocalSearch(map, {
				renderOptions:{map: map}
			});
			local.search(items[1].job[index].place);
		}
	}
	function check() {
		//异步提交表单， 提交表单成功自动跳转到发布首页。
		var formData = $("#loginForm").serialize();
		$.ajax({
			url : "../LoginServlet",
			data : formData,
			type : "post",
			contentType: "application/x-www-form-urlencoded; charset=utf-8", 
			success : function(data) {//ajax返回的数据
				var message= eval('('+data+')');
				alert(message.message);
			},
		});
	}
	function mark(obj){
		var name=obj.id;
		var b=name.indexOf("k");
		var title=name.substring(b+1,b+2);
		var jobId=document.getElementById("jobid"+title).className;
		var PayType=document.getElementById("paytype"+title).innerHTML;
		$.post("../AddMarkServlet",
				  {
				    jobId:jobId,
				    PayType:PayType
				  },
				  function(data,status){
					  var message= eval('('+data+')');
						alert(message.message);
				    
				  });
	}
	</script>
	<style type="text/css">
		<!-- 用于判定函数-->
		.over{
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			width: 40px;
		}
		.1{}
		.2{}
		.3{}
		.4{}
		.allmap{width:100%;height:380px;}
		.text-overflow {
			display:block;/*内联对象需加*/
			width:50px;
			word-break:keep-all;/* 不换行 */
			white-space:nowrap;/* 不换行 */
			overflow:hidden;/* 内容超出宽度时隐藏超出部分的内容 */
			text-overflow:ellipsis;/* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
		}
</style>

</head>
<body onload="getMessage()">
<div class="wrap-body">
<!--------------Header--------------->
<header>
	<div class="top-header">
		<div class="wrap-top zerogrid">
			<div class="row">
				<div style="float:left;text-align:left;font-size:2.4em;Color:#C6A300;font-family:楷体;margin-top:1opx;">兼职乐</div>
				<div style="text-align:right; float:right;">
				<h5 style="badding-top:50px;">未登录</h5>
				  		<!-- start login-->
							<div class="login_box">
								<div id="loginContainer">
									<a id="loginButton" style="padding-bottom:20px;"><span ></span></a>
									<div id="loginBox">
										<form id="loginForm" method="get">
											<fieldset id="body">
												<fieldset>
													<label  for="email" style="text-align:left">邮箱账号</label>
													<input type="text" name="email" id="email">
												</fieldset>
												<fieldset>
													<label for="password" style="text-align:left">密码</label>
													<input type="password" name="password" id="password">
												</fieldset>
												<input onclick="check()" type="button" id="login"  value="登录">
												<label for="checkbox">
													<input type="checkbox" id="checkbox"> <i>记住密码</i></label>
											</fieldset>
											<span><a href="zhaohui.html">忘记密码?</a></span>
											<span><a href="register.jsp">注册</a></span>
										</form>
									</div>
								</div>
							</div>
							<div class="clear"></div>
							<!-- end login -->
				</div>
			</div>
		</div>
	</div>
	<div class="wrap-header zerogrid">
		<div class="row">
			
			<div class="col-2-3">
				<nav>
					<a class="toggleMenu" href="#">Menu</a>
					<ul class="menu">
						<li><a href="index.jsp" style="color:#336666;">首页</a></li>
						<li>
							<a href="#" class="parent" style="color:#336666;">搜索兼职</a>
							<ul>
								<li>
									<a href="#" class="parent">日结型</a>
									<ul>
										<li><a href="#">按地点</a></li>
										<li><a href="#">按日期</a></li>
										<li><a href="#">按工资</a></li>
									</ul>
								</li>
								<li>
									<a href="#" class="parent">月结型</a>
									<ul>
										<li><a href="#">按工作类型</a></li>
										<li><a href="#">按工资</a></li>
									</ul>
								</li>
							</ul>
						</li>
						<li><a href="single.jsp" style="color:#336666;">发布兼职</a></li>
						<li><a href="../admin/admin.jsp" style="color:#336666;">个人管理</a></li>
					</ul>
				</nav>
			</div>
			
		</div>
	</div>
</header>

    
<div class="copyrights">Collect from <a href="http://www.cssmoban.com/" >企业网站模板</a></div>

<!--------------Content--------------->
<section class="container page-home">
	<div id="main-content" class="wrap-container zerogrid" style="background-color:#CEFFCE;">
		<article>
		<div style="position:relative;border:1px solid #e7e7e7;">
			<div class="col-1-2 right">
			<div>
				 <img id="image01" style="display:display;"  src="images/img01.jpg" /></div>
				<p id="job_notice1" style="display:none;">本工作要求有责任心，对顾客要有耐心，热情，就这样，联系电话13037237662, 每日上班不可迟到。</p>
				<div id="allmap1" style="display:none;" class="allmap"></div>
				
			</div>
		<div class="col-1-2 left"><!--   style="background-image:url(images/2.jpg);background-size:600px 380px;background-repeat:no-repeat;"-->
	<div class="art-content" style="padding-bottom:17px;">
	<div style="float:left;position: relative;left:40px;top:40px;height:200px;width:35px;text-align:center;">
		<button class="1" id="back1" onclick="change_back(this)">back</button>
	</div>
	<div style="float:left;">
	<!-- 工作一 -->
    <div id="jobid1" class="" style="text-align: center;padding:0px 65px 0px 65px;font-size:0.65em;">
    <div id="index1" class="" style="display:none;"></div>
        <div id="jobname1" class="header">无</div>
        <div id="salary1" class="price">￥59</div>  
        <div id="paytype1" class="monthly">日结</div>      
        <ul>
            <li id="date1" class="over" ><b>工作时间：</b>17:00-21:00</li>
            <li id="place1" class="over"><b>工作地点：</b>南区一栋104</li>
            <li id="state1" class="over"><b>需招人数: </b>3名</li>
			<li id="notice1" class="over"><b>工作要求: </b>年龄20周岁以上，男女不限</li>			
			<li id="postdate1" class="over"><b>发布时间: </b>年龄20周岁以上，男女不限</li>		
        </ul>
        </div> 
        <div style="padding-top:15px;padding-bottom:41px;">
        <button class="signup" id="mark1" onclick="mark(this)">收藏</button>
        <button class="signup"  id="map1">地图</button>    
        <button class="signup" id="readmore1">详情</button>       
        </div>     
</div>
	<div style="float:right;position: relative;right:40px;top:40px;height:200px;width:35px;">
		<button class="1" id="next1" onclick="change_next(this)">next</button>
	</div>
		</div>
	</div>
		</div>
		</article>
		<article>
			<div class="col-1-2">
				<img id="image02" style="display:display;"  src="images/img02.jpg" />
				<p id="job_notice2" style="display:none;">本工作要求有责任心，对顾客要有耐心，热情，就这样，联系电话13037237662, 每日上班不可迟到。</p>
				<div id="allmap2" style="display:none;" class="allmap"></div>
			</div>
			<div class="col-1-2 left"><!--   style="background-image:url(images/2.jpg);background-size:600px 380px;background-repeat:no-repeat;"-->
	<div class="art-content" style="padding-bottom:17px;">
	<div style="float:left;position: relative;left:40px;top:40px;height:200px;width:35px;text-align:center;">
		<button class="2" id="back2" onclick="change_back(this)">back</button>
	</div>
	<div style="float:left;">
	<!-- 工作一 -->
    <div id="jobid2" class="" style="text-align: center;padding:0px 65px 0px 65px;;font-size:0.65em;">
     <div id="index2" class="" style="display:none;"></div>
        <div id="jobname2" class="header">无</div>
        <div id="salary2" class="price">￥59</div>  
        <div id="paytype2" class="monthly">日结</div>      
        <ul>
            <li id="date2"><b>工作时间：</b>17:00-21:00</li>
            <li id="place2"><b>工作地点：</b>南区一栋104</li>
            <li id="state2"><b>需招人数: </b>3名</li>
			<li id="notice2" class="over"><b>工作要求:</b> 年龄20周岁以上，男女不限</li>		
			<li id="postdate2" class="over"><b>发布时间: </b>年龄20周岁以上，男女不限</li>	
        </ul>
        </div>
        <div style="padding-top:15px;padding-bottom:41px;">
        <button class="signup"  id="mark2" onclick="mark(this)">收藏</button>
        <button class="signup"  id="map2">地图</button>    
        <button class="signup"  id="readmore2" >详情</button>         
        </div>     
</div>
	<div style="float:right;position: relative;right:40px;top:40px;height:200px;width:35px;">
		<button class="2" id="next2" onclick="change_next(this)">next</button>
	</div>
		</div>
	</div>
		</article>
		<article>
			<div class="col-1-2 right">
				<img id="image03" style="display:display;"  src="images/img03.jpg" />
				<p id="job_notice3" style="display:none;">本工作要求有责任心，对顾客要有耐心，热情，就这样，联系电话13037237662, 每日上班不可迟到。</p>
				<div id="allmap3" style="display:none;" class="allmap"></div>
			</div>
			<div class="col-1-2 left"><!--   style="background-image:url(images/2.jpg);background-size:600px 380px;background-repeat:no-repeat;"-->
	<div class="art-content" style="padding-bottom:17px;">
	<div style="float:left;position: relative;left:40px;top:40px;height:200px;width:35px;text-align:center;">
		<button class="3" id="back3" onclick="change_back(this)">back</button>
	</div>
	<div style="float:left;">
	<!-- 工作一 -->
    <div id="jobid3" class="" style="text-align: center;padding:0px 65px 0px 65px;font-size:0.65em;">
     <div id="index3" class="" style="display:none;"></div>
         <div id="jobname3" class="header">无</div>
        <div id="salary3" class="price">￥59</div>  
        <div id="paytype3" class="monthly">日结</div>      
        <ul>
            <li id="date3"><b>工作时间：</b>17:00-21:00</li>
            <li id="place3"><b>工作地点：</b>南区一栋104</li>
            <li id="state3"><b>需招人数: </b>3名</li>
			<li id="notice3"  class="over"><b>工作要求:</b> 年龄20周岁以上，男女不限</li>	
			<li id="postdate3" class="over"><b>发布时间: </b>年龄20周岁以上，男女不限</li>		
        </ul>
        </div>
        <div style="padding-top:15px;padding-bottom:41px;">
        <button class="signup" id="mark3" onclick="mark(this)">收藏</button>
        <button class="signup" id="map3">地图</button>    
        <button class="signup" id="readmore3" >详情</button>                
        </div>     
</div>
	<div style="float:right;position: relative;right:40px;top:40px;height:200px;width:35px;">
		<button class="3" id="next3" onclick="change_next(this)">next</button>
	</div>
		</div>
	</div>
		</article>
		<article>
			<div class="col-1-2">
				<img id="image04" style="display:display;" src="images/img04.jpg"/>
				<p id="job_notice4" style="display:none;">本工作要求有责任心，对顾客要有耐心，热情，就这样，联系电话13037237662, 每日上班不可迟到。</p>
				<div id="allmap4" style="display:none;" class="allmap"></div>
			</div>
			<div class="col-1-2 left"><!--   style="background-image:url(images/2.jpg);background-size:600px 380px;background-repeat:no-repeat;"-->
	<div class="art-content" style="padding-bottom:17px;">
	<div style="float:left;position: relative;left:40px;top:40px;height:200px;width:35px;text-align:center;">
		<button class="4" id="back4" onclick="change_back(this)">back</button>
	</div>
	<div style="float:left;">
	<!-- 工作一 -->
    <div id="jobid4" class="" style="text-align: center;padding:0px 65px 0px 65px;font-size:0.65em;">
     <div id="index4" class="" style="display:none;"></div>
         <div id="jobname4" class="header">无</div>
        <div id="salary4" class="price">null</div>  
        <div id="paytype4" class="monthly">null</div>      
        <ul>
            <li id="date4"><b>工作时间：</b>17:00-21:00</li>
            <li id="place4"><b>工作地点：</b>南区一栋104</li>
            <li id="state4" ><b>需招人数: </b>3名</li>
			<li id="notice4" class="over"><b>工作要求:</b> 年龄20周岁以上，男女不限</li>	
			<li id="postdate4" class="over"><b>发布时间: </b>年龄20周岁以上，男女不限</li>			
        </ul>
        </div>
        <div style="padding-top:15px;padding-bottom:41px;">
        <button class="signup" id="mark4" onclick="mark(this)">收藏</button>
        <button class="signup" id="map4">地图</button>    
        <button class="signup" id="readmore4" >详情</button>                   
        </div>     
</div>
	<div style="float:right;position: relative;right:40px;top:40px;height:200px;width:35px;">
		<button class="4" id="next4" onclick="change_next(this)">next</button>
	</div>
		</div>
	</div>
		</article>
	</div>
	
	<div id="pagination" class="clearfix">
		<ul>
			<li><a class="current" href="#">1</a></li>
			<li><a href="#">2</a></li>
			<li><a href="#">3</a></li>
			<li><a href="#">4</a></li>
			<li><a href="#">next</a></li>
		</ul>
	</div>
	
</section>
<!--------------Footer--------------->
<footer>
	<div class="wrap-footer zerogrid">
		<div class="row">
			<div class="col-full">
				<div class="wrap-col">
					<h1>zSarah</h1>
					<p>Free Html5 Templates - Zerotheme.com</p>
					<div class="menu-bottom">
						<ul>
							<li><a href="#">Home</a></li>
							<li><a href="#">Blog</a></li>
							<li><a href="#">About</a></li>
							<li><a href="#">Contact</a></li>
							
						</ul>
						<div class="clear"></div>
					</div>
					
				</div>
			</div>
		</div>
	</div>
</footer>
</div>
<script type="text/javascript" src="js/navigation.js"></script>
<script type="text/javascript" src="js/login.js"></script>
</body></html>